<template>
	<div>
		<el-menu background-color="#334157" text-color="#fff" active-text-color="#ffd04b"  collapse-transition unique-opened class="el-menu-vertical-demo"
			:router="true">

			<el-submenu index="/ums">
				<template slot="title">用户和权限</template>
				<el-menu-item index="/user">用户管理</el-menu-item>
				<el-menu-item index="/role">角色管理</el-menu-item>
				<el-menu-item index="/resource">资源管理</el-menu-item>
			</el-submenu>
			<el-submenu index="/pms">
				<template slot="title">品牌和商品</template>
				<el-menu-item index="/brand">品牌管理</el-menu-item>
				<el-menu-item index="/category">分类管理</el-menu-item>
				<el-menu-item index="/product">商品管理</el-menu-item>
			</el-submenu>
			<el-submenu index="/order">
				<template slot="title">订单与发货</template>
				<el-menu-item index="/order">订单管理</el-menu-item>
				<el-menu-item index="/order/giveproduct">发货管理</el-menu-item>
			</el-submenu>
		</el-menu>
	</div>
</template>

<script>
	export default {
		name: 'WyMenu',
		data() {
			return {
				menu: []
			}
		},
		created() {
			this.menu = this.$store.getters.GET_MENU
		}
	}
</script>

<style>
	.el-menu-vertical-demo:not(.el-menu--collapse) {
		width: 200px;
		min-height: 753px;
		text-align: left;
	}
	.el-menu-item-group__title {
		padding: 0px;
	}
	.el-menu-bg {
		background-color: #1f2d3d !important;
	}
	.el-menu {
		border: none;
	}
	.logobox {
		height: 20px;
		line-height: 20px;
		color: #9d9d9d;
		font-size: 20px;
		text-align: center;
		padding: 20px 0px;
	}
	.logoimg {
		height: 20px;
	}
</style>
